/// <reference types="vitest" />
import { defineConfig, UserConfig } from 'vite'
import path from 'path'
import vue from '@vitejs/plugin-vue'
import vueJsx from '@vitejs/plugin-vue-jsx'
import legacy from '@vitejs/plugin-legacy'
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
import { visualizer } from 'rollup-plugin-visualizer'

function resolve(relativePath: string) {
  return path.resolve(__dirname, relativePath)
}

// https://vitejs.dev/config/
export default defineConfig(({ command, mode }) => {
  // mode === 'development' || mode === 'test' || mode === 'production'
  const config: UserConfig = {
    // base: '/', 默认： /
    build: {
      rollupOptions: {
        output: {
          manualChunks: {
            lodash: ['lodash'],
            html2canvas: ['html2canvas'],
            elementPlus: ['element-plus']
          }
        }
      }
    },
    resolve: {
      alias: {
        '@': resolve('src'),
        '@assets': resolve('src/assets'),
        '@comps': resolve('src/components'),
        '@views': resolve('src/views')
      }
    },
    test: {
      // jsdom 通过提供 Browser API 模拟浏览器环境；默认 node 环境
      environment: 'jsdom',
      deps: {
        inline: true // 每个依赖项都将被内联
      }
    },
    css: {
      // 在组合css时 postcss element-plus 和本地scss如果有中文 都会自动添加@charset:UTF-8，因此build会出现警告
      preprocessorOptions: {
        scss: {
          // 全局引入变量和 mixin
          // 文档上写的是additionalData 注意：在 sass-loader v8 中，这个选项名是 "prependData"
          additionalData: `
            @use "@/styles/element/index.scss" as *;
            @use "@/styles/variables.scss" as *;
            @use "@/styles/mixins.scss" as *;
          `,
          charset: false // 禁止项目scss添加@charset:UTF-8
        }
      },
      // postcss 删除库里的@charset:UTF-8
      postcss: {
        plugins: [
          {
            postcssPlugin: 'internal:charset-removal',
            AtRule: {
              charset: atRule => {
                if (atRule.name === 'charset') {
                  atRule.remove()
                }
              }
            }
          }
        ]
      }
    },
    plugins: [
      vue(),
      vueJsx(),
      legacy(),
      AutoImport({
        include: [
          /\.[tj]sx?$/, // .ts, .tsx, .js, .jsx
          /\.vue$/,
          /\.vue\?vue/, // .vue
          /\.md$/ // .md
        ],
        imports: [
          'vue',
          'vue-router',
          {
            axios: [
              // 'post', // import { post } from 'axios',
              ['default', 'axios'] // import { default as axios } from 'axios',
            ]
            // import { get, post, download } from '@service/request',
            // '@service/request': ['get', 'post', 'download']
          }
        ],
        resolvers: [
          ElementPlusResolver({
            importStyle: 'sass'
          })
        ],
        dts: 'src/auto-imports.d.ts'
      }),
      Components({
        // 默认是src/components
        // dirs: ['src/components'],
        extensions: ['vue', 'md'],
        include: [/\.vue$/, /\.vue\?vue/, /\.md$/],
        resolvers: [
          ElementPlusResolver({
            importStyle: 'sass'
          })
        ],
        dts: 'src/components.d.ts'
      })
    ]
  }
  if (mode === 'test') {
    config.plugins.push(visualizer())
  }
  return config
})
